<script setup lang="ts">
  import Carousel from './Carousel.vue' // 轮播图
  import Checkbox from './Checkbox.vue' // 复选框
  import Message from './Message.vue' // 消息提示框
  import Skeleton from './components/Skeleton/Skeleton.vue' // 骨架屏
  import City from './City.vue' // 城市列表的渲染
  import Todos from './Todos.vue' // 城市列表的渲染
  // import Dialog from './Dialog.vue' // 对话框
</script>

<template>
  <!-- <div>
    <div class="component">
      <Checkbox/>
      <Message/>
      <City/>
      
      <div class="skeleton">
        <Skeleton
          :width="100"
          :height="100"
          animated
          fade
          bg="rgba(255,255,100, 0.8)"
        />
        <Skeleton
          :width="100"
          :height="100"
          animated
          fade
        />
      </div>
    </div>

    <Carousel/>
    <Dialog/>
  </div> -->
  <Todos/>
</template>

<style scoped lang="less">
  .component {
    display: flex;
    justify-content: space-between;
    margin-bottom: 10px;
  }
 
</style>
